{% load static %}

<!DOCTYPE html>
<html data-bs-theme="light" lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>{% block title %}{% endblock %}</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css">
    {% block styles %}{% endblock %}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
    {% block scripts %}
    {% endblock %}
</head>
<body><!-- Start: Sidebar With Icons -->
<div class="bg-body shadow d-flex flex-column flex-shrink-0 position-fixed top-0 bottom-0" style="width: 4.5rem;"><a
        class="text-center link-body-emphasis d-block p-3 text-decoration-none border-bottom" href="{% url 'profile:updateViews' user.id %}" title=""
        data-bs-toggle="tooltip" data-bs-placement="right" data-bs-original-title="Icon-only">
    <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16"
         class="bi bi-bootstrap-fill" style="font-size: 25px;">
        <path d="M6.375 7.125V4.658h1.78c.973 0 1.542.457 1.542 1.237 0 .802-.604 1.23-1.764 1.23H6.375zm0 3.762h1.898c1.184 0 1.81-.48 1.81-1.377 0-.885-.65-1.348-1.886-1.348H6.375v2.725z"></path>
        <path d="M4.002 0a4 4 0 0 0-4 4v8a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4V4a4 4 0 0 0-4-4h-8zm1.06 12V3.545h3.399c1.587 0 2.543.809 2.543 2.11 0 .884-.65 1.675-1.483 1.816v.1c1.143.117 1.904.931 1.904 2.033 0 1.488-1.084 2.396-2.888 2.396H5.062z"></path>
    </svg>
    <span class="visually-hidden">Icon-only</span></a>
    <ul class="nav nav-pills flex-column text-center nav-flush mb-auto">
        <li class="nav-item"><a class="nav-link active link-light py-3 border-bottom rounded-0" href="{%  url 'index' %}"
                                aria-current="page">Главная
        </a></li>
        {% if user.is_teacher or user.is_student %}
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'profile:profile_cabinet' user.id %}">Кабинеты
            </a></li>
        {% endif %}
        {% if user.is_teacher %}
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'profile:services' %}">Услуги
            </a></li>
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'profile:publish_post' %}">Создать пост
            </a></li>
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'profile:users_list' %}">Список пользователей
            </a></li>

        {% endif %}
        {% if cabinet_id %}
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'cabinet:userfull_info_cab' cabinet_id %}">Полезные материалы</a>
            </li>
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'cabinet:records_cab' cabinet_id %}">Ссылки на запись уроков</a>
            </li>
            <li class="nav-item"><a class="nav-link py-3 border-bottom rounded-0" href="{%  url 'cabinet:send_mail' cabinet_id %}">Отправка писем
            </a></li>
        {% endif %}
        {% if title != 'Полезная информация' %}
                {% block url %}{% endblock %}
        {% endif %}



    </ul>

{#    <div class="dropdown show p-3 border-top"><a#}
{#            class="dropdown-toggle link-body-emphasis d-flex align-items-center text-decoration-none"#}
{#            aria-expanded="true" data-bs-toggle="dropdown" role="button"><img class="rounded-circle" alt="" width="32"#}
{#                                                                              height="32"#}
{#                                                                              src="https://cdn.bootstrapstudio.io/placeholders/1400x800.png"#}
{#                                                                              style="object-fit: cover;"></a>#}
{#        <div class="dropdown-menu show shadow text-small" data-bs-popper="none" data-popper-placement="top-start"><a#}
{#                class="dropdown-item" href="#">New project...</a><a class="dropdown-item" href="#">Settings</a><a#}
{#                class="dropdown-item" href="#">Profile</a>#}
{#            <div class="dropdown-divider"></div>#}
{#            <a class="dropdown-item" href="#">Sign out</a></div>#}
{#    </div>#}
</div><!-- End: Sidebar With Icons --><!-- Start: Sidebar -->
<div class="container">
    <div class="row">
        <div class="col-md-8 col-lg-1"></div>
        <br>
        <br>
        {% block content %}
        {% block modals %}{% endblock %}
        {% endblock %}

    </div>
</div><!-- End: Sidebar -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script>
{% block script %}{% endblock %}
</body>
</html>